<template>
  <div class="dashboard-container">
    <!--
      before-upload：上传文件之前调用的函数，用于校验文件，需要返回值，return true之后才能上传成功
      on-success：上传成功之后调用的函数
     -->
    <!-- 导入excel表格 -->
    <!-- <UploadExcel :on-success="handleSuccess" :before-upload="beforeUpload" /> -->
    <!-- 图片上传组件 -->
    <ImageUpload />
  </div>
</template>

<script>
import { mapGetters } from 'vuex'

export default {
  name: 'Dashboard',
  computed: {
    ...mapGetters([
      // 'name'
    ])
  },
  methods: {
    // 上传文件之前调用的函数
    beforeUpload(file) {
      console.log('上传文件之前')
      // 上传的文件大小：小于1M
      const isLt1M = file.size / 1024 / 1024 < 1

      // 小于1M，校验成功
      if (isLt1M) {
        return true
      }

      this.$message({
        message: '上传的文件大小不能超过1M',
        type: 'warning'
      })
      return false
    },
    // 上传成功之后调用的函数
    handleSuccess({ header, results }) {
      console.log('上传成功了', header, results)
    }
  }
}
</script>

<style lang="scss" scoped>
.dashboard {
  &-container {
    margin: 30px;
  }
  &-text {
    font-size: 30px;
    line-height: 46px;
  }
}
</style>
